﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../Script/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="js/raphael.js" type="text/javascript"></script>
    <script src="js/Chart3D-1.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            var config = {
                chart: {
                    renderTo: "container",
                    type: "pie"
                },
                title: {
                    text: "浏览器市场占有率",
                    x: -20 //center
                },
                tooltip: {
                    formatter: function () {
                        return '' + this.series.name + '：' + this.percentage.toFixed(2) + '%:(' + this.y + ')';
                    }
                },
                plotOptions: {
                    pie: {
                        dataLabels: {
                            showInLegend:true  //是否显示内容
                        }
                    }
                },
                series: [{
                    data: [{ name: 'IE', y: 30.7, selected: true },
                            ['Chrome', 20.7],
                            ['Firefox', 25.7],
                            ['Safari', 21.4],
                            ['Opera', 10.7],
                            ['Other', 4.7]
                        ]
                }]
            };
            var chart = new $.Chart3D(config);
        });                    
    </script>
</head>
<body>
 <div id="container" style="height:400px; width:100%; min-width:800px;"></div>
</body>
</html>
